<template>
  <div class="userDistribution-container">
    <el-container>
      <el-aside width="200px">
        <el-menu
          default-active="/userDistribution/staff"
          class="el-menu-vertical-demo"
          router
          background-color="#f5f7fa"
          active-text-color="#409EFF"
        >
          <el-menu-item index="/userDistribution/staff">
            <i class="el-icon-user"></i>
            <span slot="title">业务员</span>
          </el-menu-item>
          <el-menu-item index="/userDistribution/admin">
            <i class="el-icon-s-custom"></i>
            <span slot="title">管理员</span>
          </el-menu-item>
          <el-menu-item index="/userDistribution/myStaff">
            <i class="el-icon-user-solid"></i>
            <span slot="title">我的组员</span>
          </el-menu-item>
          <el-menu-item
            index="/userDistribution/distribute"
            v-if="admin === 'true'"
          >
            <!-- 这里写权限 管理员 部长 组长  只能管理员参与分发 -->
            <i class="el-icon-s-promotion"></i>
            <span slot="title">客户分发</span>
          </el-menu-item>
        </el-menu>
      </el-aside>
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </div>
</template>

<script>
export default {
  name: 'userDistribution-page',
  data () {
    return {
      admin: ''
    }
  },
  created () {
    this.admin = localStorage.getItem('crm-admin')
  },
  methods: {}
}
</script>

<style lang="scss" scoped>
.userDistribution-container {
  height: 877px;
  .el-container {
    height: 877px;
    .el-aside {
      background-color: #f5f7fa;
      .el-menu {
        border: none;
      }
    }
    .el-main {
      padding: 20px;
    }
  }
}
</style>
